<template>
	<view class="partner-wrapper">
		<!-- 返回首页 -->
		<uni-bankhome />
		<view class="pageTitle">
			<image src="https://rsyl.oss-cn-beijing.aliyuncs.com/6b52761c6f284155928e00bb6017ed32.png" mode="" class="pageTitleImg" style="height: 357px;"></image>
		</view>
		<view class="list" v-if="tianshi">
			<view class="item ts">
				<image class="image" @click='choosePartner("ts")' src="https://rsyl.oss-cn-beijing.aliyuncs.com/f90efad0a1944d70b14b2cb0ef43fc5a.png" style="width: 100%;height: 198px;"></image>
			</view>
			<view class="item sy">
				<image class="image" @click='choosePartner("sy")' src="https://rsyl.oss-cn-beijing.aliyuncs.com/15426470b0fc4737a64b29350102e1e9.png" style="width: 100%;height: 198px;"></image>
			</view>
			<view class="item cs">
				<image class="image" @click='choosePartner("cs")' src="https://rsyl.oss-cn-beijing.aliyuncs.com/6d5585d7a57e49cbb3fdce5791b99027.png" style="width: 100%;height: 198px;"></image>
			</view>
		</view>
	</view>
</template>
<script>
	import {
		getUserWallet,
		CreatePartner,
		TSRateSetting
	} from "@/api/members";
	import {
		getUserInfo
	} from "@/api/members";
	import storage from "@/utils/storage.js";
	import * as API_Trade from "@/api/trade";
	export default {
		data() {
			return {
				userInfo: {},
				tianshi: '',
				applyImageURL: '/static/titIeImg.png'
			}
		},
		async onShow() {
			this.userInfo = this.$options.filters.isLogin();
			if (this.$options.filters.isLogin("auth")) {} else {
				uni.showToast({
					icon: "none",
					duration: 3000,
					title: "请先登录！",
				});
				this.$options.filters.navigateToLogin("redirectTo");
			}
		},
		onLoad(options) {
			TSRateSetting().then((res) => {
				res.data.result.map(item => {
					switch (item.roleName) {
						case "推广员":
							this.tuiguangyuan = {
								...item
							}
							break;
						case "天使合伙人":
							this.tianshi = {
								...item
							}
							break;
						case "事业合伙人":
							this.shiye = {
								...item
							}
							break;
						default:
							break;
					}
				})
			})
		},
		methods: {
			choosePartner(type) {
				uni.navigateTo({
					url: '/pages/partner/apply?partner=' + type
				})
			},
			navigator(url) {
				uni.navigateTo({
					url: url
				})
			}
		}
	}
</script>

<style lang="scss">
	.partner-wrapper {
		width: 100%;
		height: 100%;
		background: rgba(255, 113, 58, 1);

		.bg-set {
			position: fixed;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			z-index: -1;
		}

		.pageTitle {
			height: auto;
			max-width: 100%;
			height: 100%;
			// padding: calc(80rpx + var(--status-bar-height)) 30rpx 280upx 6%;
			// background-size: cover;
			// background-position: bottom;
			// background-repeat: no-repeat;
			.pageTitleImg {
				width: 100%;
				// margin-left: 114rpx;
			}
		}

		.list {
			width: 100%;
			height: auto;
			padding: 24upx 3%;
			box-sizing: border-box;
			margin-top: -85px;

			.item {
				margin-bottom: 60upx;
				height: auto;
				padding: 36upx 24upx 50rpx 24rpx;
				box-sizing: border-box;
				display: flex;
				flex-direction: column;
				justify-content: center;
				border-radius: 12upx;
				border: 1px solid rgba($color: #ffffff, $alpha: 0.6);
				color: #FFFFFF;
				letter-spacing: 2rpx;
				font-size: 32rpx;
				position: relative;

				.title {
					width: 100%;
					height: auto;
					text-align: center;
					font-size: 35rpx;
				}

				.detail {
					margin-top: 12upx;
					font-size: 28upx;
					line-height: 42rpx;
					text-align: center;
				}

				.applyBtn {
					width: auto;
					height: auto;
					padding: 0 60rpx;
					box-sizing: border;
					position: absolute;
					margin-left: 7%;
					bottom: -60rpx;

					.clickApply {
						position: absolute;
						bottom: 35rpx;
						right: 140rpx;
						color: #000;
						font-size: 36rpx;
						color: #FFFFFF;
					}

					.applyBtnImg {
						width: 300rpx;
						height: 100rpx;
					}
				}

				// &.pt {
				// 	color: #fff;
				// 	background-image: linear-gradient(to right, #faa7c1, #f1cbdb);
				// }

				// &.ts {
				// 	color: #fff;
				// 	background-image: linear-gradient(to right, #faa7c1, #f1cbdb);
				// }

				// &.sy {
				// 	// display: none;
				// 	color: #fff;
				// 	background-image: linear-gradient(to right, #fac671, #f1d7aa);
				// }

				// &.qy {
				// 	// display: none;
				// 	color: #fff;
				// 	background-image: linear-gradient(to right, blue, #999999);
				// }

				// &.cs {
				// 	// display: none;
				// 	color: #b9b425;
				// 	background-image: linear-gradient(to right, #222222, #999999);
				// }

				// &.active {
				// 	border: 1px solid #f2140c;
				// }
			}
		}

		// .footer-wrapper {
		// 	position: fixed;
		// 	padding: 0 24upx;
		// 	bottom: 0;
		// 	left: 0;
		// 	right: 0;
		// 	height: 120upx;
		// 	box-shadow: 0 0 24upx 0upx rgba(0, 0, 0, .1);
		// 	display: flex;
		// 	justify-content: flex-end;
		// 	align-items: center;

		// 	.money {
		// 		flex: 1;
		// 		display: flex;
		// 		flex-direction: column;
		// 		justify-content: center;

		// 		.hb {
		// 			font-size: 30upx;
		// 			color: $light-color;
		// 			font-weight: bold;
		// 		}
		// 	}

		// 	.button {
		// 		height: 80rpx;
		// 		color: #fff;
		// 		line-height: 80rpx;
		// 		background: linear-gradient(91deg, $light-color 1%, $aider-light-color 99%);
		// 		padding: 0 44rpx;
		// 		text-align: center;
		// 		border-radius: 400px;
		// 		font-size: 28upx;
		// 	}

		// 	.textsss {
		// 		height: 80rpx;
		// 		color: #fff;
		// 		line-height: 80rpx;
		// 		background-image: linear-gradient(135deg, #f2140c, #f2270c 70%, #f24d0c);
		// 		// background: linear-gradient(91deg, $light-color 1%, $aider-light-color 99%);
		// 		padding: 0 44rpx;
		// 		text-align: center;
		// 		border-radius: 400px;
		// 		font-size: 28upx;
		// 		// border: 1px solid #ccc;
		// 		margin-right: 30upx;
		// 	}
		// }
	}

	.textsss {
		height: 80rpx;
		color: #fff;
		line-height: 80rpx;
		background-image: linear-gradient(135deg, #f2140c, #f2270c 70%, #f24d0c);
		// background: linear-gradient(91deg, $light-color 1%, $aider-light-color 99%);
		padding: 0 44rpx;
		text-align: center;
		border-radius: 400px;
		font-size: 28upx;
		// border: 1px solid #ccc;
		margin-right: 30upx;
	}
</style>
